$(() => {
    /*//  处理后台传过来的数据
    function changeData(allData, firstRowData) {
        let result = [];
        for (let i = 0; i < allData[0].length; i++) {
            allData[0][i] = parseFloat(allData[0][i]);
        }
        for (let i = 1; i < firstRowData.length; i++) {     //  解析数据
            for (let j = 0; j < allData[0].length; j++) {
                let inData = [];
                inData.push((allData[0][j] * 100 / 3));     //  x轴坐标,0.03,0.06...变为1,2,...
                // inData.push(firstRowData[i]);    //  y轴坐标,第一行原始值
                inData.push(i - 1);     //  y轴坐标,0,1,2...
                if (allData[i][j] > 1 || allData[i][j] < 0) {   //  移除坏数据
                    allData[i][j] = null;
                }
                inData.push(allData[i][j]);     //  数据值
                result.push(inData);
            }
        }
        for (let i = 0; i < result.length; i++) {      //  交换xy坐标
            let temp;
            temp = result[i][0];
            result[i][0] = result[i][1];
            result[i][1] = temp;
        }
        return result;
    }

    //  路径获取
    function getContextPath() {
        let strPath = window.document.location.pathname;
        return strPath.substring(0, strPath.substr(1).indexOf('/') + 1);
    }

    let leftUpPicData = [];     //  左上热力图数据
    let leftDownPicData = [];   //  左下热力图数据

    //  选择文件绘图
    $("#firstSelect").change(function () {
        if ($(this).val() === "0") {
            $.ajax({
                type: "POST",
                url: getContextPath() + "/path",
                contentType: 'application/json;charset=utf-8',
                data: JSON.stringify({name: "b.csv"}),
                success(data) {
                    let jsonData = JSON.parse(data);
                    leftUpPicData = changeData(jsonData.allData, jsonData.firstRowData);
                    heatMapPic.setOption({
                        series: [{  //  左上图
                            data: leftUpPicData,
                        }, {  //  左下图

                        }]
                    });
                },
                error() {
                    console.log("fail");
                }
            });
        } else if ($(this).val() === "1") {
            $.ajax({
                type: "POST",
                url: getContextPath() + "/path",
                contentType: 'application/json;charset=utf-8',
                data: JSON.stringify({name: "c.csv"}),
                success(data) {
                    let jsonData = JSON.parse(data);
                    leftUpPicData = changeData(jsonData.allData, jsonData.firstRowData);
                    heatMapPic.setOption({
                        series: [{  //  左上图
                            data: leftUpPicData,
                        }, {  //  左下图

                        }]
                    });
                },
                error() {
                    console.log("fail");
                }
            });
        }
    });

    $("#secondSelect").change(function () {
        if ($(this).val() === "0") {
            $.ajax({
                type: "POST",
                url: getContextPath() + "/path",
                contentType: 'application/json;charset=utf-8',
                data: JSON.stringify({name: "b.csv"}),
                success(data) {
                    let jsonData = JSON.parse(data);
                    leftDownPicData = changeData(jsonData.allData, jsonData.firstRowData);
                    heatMapPic.setOption({
                        series: [{  //  左上图

                        }, {  //  左下图
                            data: leftDownPicData,
                        }]
                    });
                },
                error() {
                    console.log("fail");
                }
            });
        } else if ($(this).val() === "1") {
            $.ajax({
                type: "POST",
                url: getContextPath() + "/path",
                contentType: 'application/json;charset=utf-8',
                data: JSON.stringify({name: "c.csv"}),
                success(data) {
                    let jsonData = JSON.parse(data);
                    leftDownPicData = changeData(jsonData.allData, jsonData.firstRowData);
                    heatMapPic.setOption({
                        series: [{  //  左上图

                        }, {  //  左下图
                            data: leftDownPicData,
                        }]
                    });
                },
                error() {
                    console.log("fail");
                }
            });
        }
    });*/

    // 热力图
    let heatMapPicL1_1 = echarts.init(document.getElementById('heatMapL1_1'));
    let heatMapPicL1_2 = echarts.init(document.getElementById('heatMapL1_2'));
    let heatMapPicL1_3 = echarts.init(document.getElementById('heatMapL1_3'));
    let heatMapPicL1_4 = echarts.init(document.getElementById('heatMapL1_4'));
    let heatMapPicL1_5 = echarts.init(document.getElementById('heatMapL1_5'));
    let heatMapPicL1_6 = echarts.init(document.getElementById('heatMapL1_6'));
    let heatMapPicL1_7 = echarts.init(document.getElementById('heatMapL1_7'));
    let heatMapPicL1_8 = echarts.init(document.getElementById('heatMapL1_8'));
    let heatMapPicL1_9 = echarts.init(document.getElementById('heatMapL1_9'));
    let heatMapPicL1_0 = echarts.init(document.getElementById('heatMapL1_0'));


    let xData = [];
    let yData = [];
    //  x坐标
    for (let i = 0; i <= 136; i++) {
        xData.push(i);
    }
    //  y坐标
    for (let j = 0; j < 401; j++) {
        yData.push(j);
    }

    heatMapOption = {
        tooltip: {},
        grid: [{    //  heatMap
            height: '60%',
            width: '70%',
            top: '15%',
            left: '20%'
        }, {    //  line
            height: '60%',
            width: '70%',
            top: '15%',
            left: '20%'
        }],
        xAxis: [{   //  heatMap
            show: false,
            type: 'category',
            data: xData,
            gridIndex: 0,
            axisLine: {  //  轴线属性
                lineStyle: {
                    color: '#f2f2f2'
                }
            },
            id: 'heatMap'
        }, {   //  line
            // show: false,
            type: 'category',
            data: xData,
            axisLine: {  //  轴线属性
                lineStyle: {
                    color: '#f2f2f2'
                }
            },
            gridIndex: 1,
            id: 'heatMap1'
        }],
        yAxis: [{   //  heatMap
            show: false,
            type: 'category',
            data: yData,
            gridIndex: 0,
            axisLine: {  //  轴线属性
                lineStyle: {
                    color: '#f2f2f2'
                }
            },
            id: 'heatMap'
        }, {    //  line
            // show: false,
            type: 'category',
            data: yData,
            max: 12,
            axisLine: {  //  轴线属性
                lineStyle: {
                    color: '#f2f2f2'
                }
            },
            gridIndex: 1,
            id: 'heatMap1'
        }],
        visualMap: [{
            min: 0,
            max: 1,
            itemHeight: '100%',
            calculable: false,  //  控制拖动
            realtime: false,
            text: ['1', '-1'],
            textStyle: {
                color: '#fff'
            },
            inRange: {
                color: ['#313695', '#4575b4', '#74add1', '#abd9e9', '#e0f3f8', '#ffffbf', '#fee090', '#fdae61', '#f46d43', '#d73027', '#a50026']
            },
            top: '10%',
            left: '3%'
        }],
        series: [{  //  heatMap
            type: 'heatmap',
            data: [],
            emphasis: {
                itemStyle: {
                    borderColor: '#333',
                    borderWidth: 1
                }
            },
            progressive: 1000,
            animation: false,
        }, {  //  line
            type: 'line',
            data: [],
        }]
    };

    heatMapPicL1_1.setOption(heatMapOption);
    heatMapPicL1_2.setOption(heatMapOption);
    heatMapPicL1_3.setOption(heatMapOption);
    heatMapPicL1_4.setOption(heatMapOption);
    heatMapPicL1_5.setOption(heatMapOption);
    heatMapPicL1_6.setOption(heatMapOption);
    heatMapPicL1_7.setOption(heatMapOption);
    heatMapPicL1_8.setOption(heatMapOption);
    heatMapPicL1_9.setOption(heatMapOption);
    heatMapPicL1_0.setOption(heatMapOption);


});